<template>
  <div class="boss">
      <div class="top">
          <div class="zuo">
              <h4>获取安心装修权益</h4>
              <h6>帮你省钱 为你的新家保驾护航</h6>
          </div>
          <div class="you">
              <van-icon name="plus" />
              添加我的家
          </div>
      </div>
      <div class="center">
          <div>
              <van-icon name="records" />
              <p>先装修后支付</p>
          </div>
          <div>
              <van-icon name="records" />
              <p>免费设计</p>
          </div>
          <div>
              <van-icon name="records" />
              <p>在线管工地</p>
          </div>
          <div>
              <van-icon name="records" />
              <p>专业质检</p>
          </div>
      </div>
  </div>
</template>

<script>
export default {

}
</script>

<style scoped>
.boss{
    border: 1px solid gray;
    margin: 0 .15rem;
    border-radius: .1rem;
}
  .top{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid gray;
    height: .7rem;
  }
   .you{
       width: 1.1rem;
       height: .4rem;
       background-color: #60c48c;
       text-align: center;
       line-height: .4rem;
       border-radius: .1rem;
   }
   .center{
       display: flex;
       height: .5rem;
       align-items: center;
       justify-content: space-around;
   }
   .center div{
       display: flex;
   }
</style>